<template>
	<div class="zhengtuojianhuo">
		<van-nav-bar :fixed="true" class="navBar" title="笼车拣货" left-arrow @click-left="$router.go(-1)"></van-nav-bar>

		<div class="goodsFromWarp">

				<div class="goodsInputWarp">
						<div class="goodsInputLabel">
							<div class="goodsInputBorder"></div>
							<div class="skuName">位置：</div>
						</div>

						<div class="skuNoInput">
							{{editForm.hqpbdq}}
						</div>

						<div class="searchBtn">
							<button :disabled="isdisabled"  @click.stop="_getAddressBtn()" >
								<van-icon name="search" size="20" color="#1989fa"  />
							</button>
						</div>
				</div>

				<div class="goodsInputWarp">
						<div class="goodsInputLabel">
							<div class="goodsInputBorder"></div>
							<div class="skuName">门店：</div>
						</div>



						<div class="skuNoInput">
							{{editForm.ck_storeid}} {{editForm.ck_storeid>''?'-':''}} {{editForm.storename}}
						</div>


						<div class="searchBtn">
							<button :disabled="isdisabled"  @click.stop="_selectSku()" >
								<van-icon name="ellipsis" color="#1989fa"  />
							</button>
						</div>
				</div>


				<div class="goodsInputWarp">
						<div class="goodsInputLabel">
							<div class="goodsInputBorder"></div>
							<div class="skuName">商品名称：</div>
						</div>

						<div class="skuNoInput">
							{{editForm.subsname}}
						</div>

				</div>


				<div class="goodsInputWarp">
						<div class="goodsInputLabel">
							<div class="goodsInputBorder"></div>
							<div class="skuName">商品编码：</div>
						</div>

						<div class="skuNoInput">
							{{editForm.itemid}}
						</div>

						<van-field
							 style="width:170px;"
							 class="skuInput"
							 v-model="verifyForm.itemid"
							 placeholder="商品编码"
						 />
				</div>




				<div class="goodsInputWarp">
						<div class="goodsInputLabel">
							<div class="goodsInputBorder"></div>
							<div class="skuName">仓位编码：</div>
						</div>

						<div class="skuNoInput">
							{{editForm.cwno}}
						</div>

						<van-field
							 style="width:170px;"
							 class="skuInput"
							 v-model="verifyForm.cwno"
							 placeholder="仓位编码"
						 />
				</div>

				<div class="goodsInputWarp">
						<div class="goodsInputLabel">
							<div class="goodsInputBorder"></div>
							<div class="skuName">商品条码：</div>
						</div>

						<div class="skuNoInput">
							{{editForm.barcode}}
						</div>
				</div>


				<div class="goodsInputWarp">
						<div class="goodsInputLabel">
							<div class="goodsInputBorder"></div>
							<div class="skuName">分配箱装：</div>
						</div>


						<div class="skuNoInput">
								{{editForm.unit}}
						</div>

						<div class="goodsInputLabel">
							<div class="skuName">箱数：</div>
						</div>

						<van-field
							 v-if="addmode"
							 class="skuInput"
							 v-model="editForm.pack"
							 placeholder="请输入箱数"
						 />

						<div class="skuNoInput" v-if="!addmode">
							{{editForm.pack}}
						</div>
				</div>

				<div class="goodsInputWarp">

						<div class="goodsInputLabel">
							<div class="goodsInputBorder"></div>
							<div class="skuName">总数量：</div>
						</div>


						<div class="skuNoInput">
							{{editForm.yjtotqty}}
						</div>

						<div class="goodsInputLabel">
							<!-- <div class="goodsInputBorder"></div> -->
							<div class="skuName">散数：</div>
						</div>

						<van-field
							 v-if="addmode"
							 class="skuInput"
							 v-model="editForm.qty"
							 placeholder="请输入散数"
						 />

						<div class="skuNoInput"  v-if="!addmode">
								{{editForm.qty}}
						</div>


				</div>


				<div class="goodsInputWarp">
						<div class="goodsInputLabel">
							<div class="goodsInputBorder"></div>
							<div class="skuName">拣货容器：</div>
						</div>

						<div class="skuNoInput">
								{{skuData[index].jhrq}}
						</div>
				</div>


		</div>


		<div class="skuBtn">
			<van-button type="info" :disabled="isdisabled" @click="lingquBtn()">领取任务</van-button>
			<van-button type="info" :disabled="isdisabled" @click="saveGoodsBtn()">确认</van-button>
		</div>

		<div class="skuBtn">
			<van-button type="info"  v-if="!addmode" @click="editSkuClick()">修改</van-button>
			<van-button type="info"  v-if="addmode" @click="saveSkuBtnClick()">确认修改</van-button>
			<van-button type="info"  @click="overRongQiBtnClick()">结束容器</van-button>
		</div>



		<van-overlay :show="isLingQuVisible" :lock-scroll="false">
			<div class="shipandanWrapper">
					<van-sticky>
						<van-nav-bar class="navBar" title="仓位列表" left-arrow @click-left="isLingQuVisible = false"></van-nav-bar>
					</van-sticky>
					<div class="shipandanCon" @click.stop>
							<div  v-for="(row,i) in lingquData" :key="i" class="danjuRow"  @click="lingquClick(row)">
								<van-row class="skuList">
								  <van-col span="24"> <span>任务号：</span> {{row.bill}}</van-col>
								</van-row>

								<van-row class="skuList" >
								  <van-col span="24"> <span>仓位：</span> {{row.cwno}}</van-col>
								</van-row>

								<van-row class="skuList"  >
									<van-col span="24"> <span>拼接仓位：</span> {{row.cwnop}}</van-col>
								</van-row>

								<van-row class="skuList"  >
									<van-col span="24"> <span style="width: 110px;">仓位顺序号：</span> {{row.route_c}}</van-col>
								</van-row>

								<van-row class="skuList"  >
									<van-col span="12"> <span>集货位：</span> {{row.wno}}</van-col>
									<van-col span="12"> <span>仓库：</span> {{row.whsid}}</van-col>
								</van-row>

								<van-row class="skuList"  >
									<van-col span="12"> <span>区：</span> {{row.q_no}}</van-col>
									<van-col span="12"> <span>排：</span> {{row.p_no}}</van-col>
								</van-row>

								<van-row class="skuList"  >
									<van-col span="12"> <span>出货总量：</span> {{row.yjtotqty}}</van-col>
									<van-col span="12"> <span>托盘总量：</span> {{row.tqty}}</van-col>
								</van-row>

							</div>
					</div>
			</div>
		</van-overlay>


		<van-overlay :show="isSkuVisible" :lock-scroll="false">
			<div class="shipandanWrapper">
					<van-sticky>
						<van-nav-bar class="navBar" title="商品列表" left-arrow @click-left="isSkuVisible = false"></van-nav-bar>
					</van-sticky>
					<div class="shipandanCon" @click.stop>
							<div  v-for="(row,i) in skuData" :key="i" class="danjuRow" @click="selectSkuClick(row)" >
								<van-row class="skuList">
								  <van-col span="24"> <span>商品名称：</span> {{row.subsname}}</van-col>
								</van-row>

								<van-row class="skuList" >
								  <van-col span="24"> <span>商品编码：</span> {{row.itemid}}</van-col>
								</van-row>

								<van-row class="skuList"  >
									<van-col span="12"> <span>箱装：</span> {{row.unit}}</van-col>
									<van-col span="12"> <span>箱数：</span> {{row.pack}}</van-col>
								</van-row>

								<van-row class="skuList"  >
									<van-col span="12"> <span>散数：</span> {{row.qty}}</van-col>
									<van-col span="12"> <span>总数量：</span> {{row.yjtotqty}}</van-col>
								</van-row>
							</div>
					</div>
			</div>
		</van-overlay>

		<van-overlay :show="isAddressVisible" :lock-scroll="false">
			<div class="shipandanWrapper">
					<van-sticky>
						<van-nav-bar class="navBar" title="位置信息" left-arrow @click-left="isAddressVisible = false"></van-nav-bar>
					</van-sticky>
					<div class="shipandanCon" @click.stop>
							<div  v-for="(row,i) in addressItem" :key="i" class="danjuRow" @click="selectAddressClick(row)">

								<div class="skuHeader">
									<div class="skuHeaderLabel">货区排单：</div>
									<div class="skuHeaderCon">{{row.hqpbdq}}</div>
								</div>

								<van-row class="skuList" >
								  <van-col span="24"> <span>明细条数：</span> {{row.ylmxts}}</van-col>
								</van-row>

								<van-row class="skuList">
								  <van-col span="24"> <span>门店：</span> {{row.ck_storeid}}</van-col>
								</van-row>

								<van-row class="skuList"  >
									<van-col span="12"> <span>总数：</span> {{row.hztotqty}}</van-col>
									<van-col span="12"> <span>通道：</span> {{row.td_no}}</van-col>
								</van-row>

								<van-row class="skuList"  >
									<van-col span="24"> <span>仓位自：</span> {{row.cwno_f}}</van-col>
								</van-row>

								<van-row class="skuList"  >
									<van-col span="24"> <span>仓位止：</span> {{row.cwno_t}}</van-col>
								</van-row>
							</div>
					</div>
			</div>
		</van-overlay>




	</div>
</template>

<script>

export default {
  name: 'longchejianhuo',
  data() {
    return {
			editForm:{
				hqpbdq:'',
				td_no:'',
				ck_storeid:'',
				storename:'',
				cwno:'',
				unit:'',
				pack:'',
				qty:'',
				yjtotqty:'',
				subsname:'',
				username:'',
				barcode:'',
				bill:'',
				itemid:'',
				subid:'',
				jhrq:'',
			},
			isdisabled:false,
			lingquData:[
				{
					bill:''
				}
			],
			isLingQuVisible:false,
			skuData:[
				{
					subsname	:'',
					ck_storeid	:'',
					storename	:'',
				}
			],
			isSkuVisible:false,
			index:0,
			isAddressVisible:false,
			addressItem:[
				{
					hqpbdq:'',
				}
			],
			addmode:true,
			unit1:'',
			qty1:'',
			verifyForm:{
				itemid:'',
				cwno:'',
				barcode:'',
			},
			jieshuData:[],
		};
  },
	computed: {
	   ryuser: function(){
	     return this.GWO(true).gUSER;
	   }
	},
  methods: {
		_selectSku(){
			if(this.skuData[0].subsname >''){
					this.isSkuVisible = true
			}
		},
		_getSku(){
			if(this.editForm.cwno >''){

			}else{
				return this.$toast.fail('请先领取任务')
			}
			let sendData = {
				'kqid':this.ryuser.kqid,
				'czyid':this.ryuser.operatorid,
				'cwno':this.editForm.cwno,
				'storeid':this.editForm.storeid,
				'unit':this.editForm.unit,
				'whsid':this.editForm.whsid,
				'itemid':this.editForm.itemid,
				'subid':this.editForm.subid,
			}
			console.log(sendData)
			var _self = this;
				var ldemodata = [{retval:0, errmsg:'返回数据集'},]
				this.MYPOST({
					'method':'dgate',
					'pname':'f_wmsa_y_jianhuo',
					'i':this.FNULLE([
					'opmode','Y_JTBH_qryitemid',
					'kqid', this.ryuser.kqid,
					'czyid',this.ryuser.operatorid,
					'cwno',this.editForm.cwno,
					'storeid',this.editForm.storeid,
					'unit',this.editForm.unit,
					'whsid',this.editForm.whsid,
					'itemid',this.editForm.itemid,
					'subid',this.editForm.subid,
					])
					},'获取商品详情',true, ldemodata, function(ret_obj, ret_iserr,ret_errmess,ret_oldresp){
					if(ret_iserr){ //传入的true参数,理论上不会有此回调了
						_self.$toast.fail('查询失败')
						_self.$store.commit('hideLoading');
					}else{
						var rtn_json_obj = null;
						_self.$store.commit('hideLoading');
						if(ret_obj != null){ rtn_json_obj = ret_obj; //返回的接口可以直接解析的情况
						}else{  rtn_json_obj = _self.arr2Obj(ret_oldresp.data); //非标准的dgate接口,返回的一个不兼容的处理
						}
						_self.lingquData = rtn_json_obj
						console.log("得到商品详情")
						console.log(rtn_json_obj)
						_self.skuData = rtn_json_obj
						console.log("得到获取商品详情")
						console.log(rtn_json_obj[0])
						if(_self.skuData.length > 0){
							// _self.isSkuVisible = true
						}else{
							_self.$toast.fail('暂无获取商品详情')
						}
					}
				});
		},
		lingquBtn(){
			var _self = this;
			var ldemodata = [{retval:0, errmsg:'返回数据集'},]
			this.MYPOST({
				'method':'dgate',
				'pname':'f_wmsa_y_jianhuo',
				'i':this.FNULLE([
				'opmode','Y_LONGCHE_lqbill',
				'czyid',this.ryuser.operatorid,
				'kqid', this.ryuser.kqid,
				'ck_storeid',this.editForm.ck_storeid,
				'td_no',this.editForm.td_no,
				])
				},'笼车拣货领取任务',true, ldemodata, function(ret_obj, ret_iserr,ret_errmess,ret_oldresp){
				if(ret_iserr){ //传入的true参数,理论上不会有此回调了
					_self.$toast.fail('查询失败')
					_self.$store.commit('hideLoading');
				}else{
					var rtn_json_obj = null;
					_self.$store.commit('hideLoading');
					if(ret_obj != null){ rtn_json_obj = ret_obj; //返回的接口可以直接解析的情况
					}else{  rtn_json_obj = _self.arr2Obj(ret_oldresp.data); //非标准的dgate接口,返回的一个不兼容的处理
					}
					_self.skuData = rtn_json_obj
					console.log("得到笼车拣货领取任务")
					console.log(rtn_json_obj)
					if(_self.skuData.length > 0){
						_self.editForm.ck_storeid 		= _self.skuData[0].ck_storeid
						_self.editForm.storename 			= _self.skuData[0].storename
						_self.editForm.cwno 					= _self.skuData[0].cwno
						_self.editForm.unit 					= _self.skuData[0].unit
						_self.editForm.pack 					= _self.skuData[0].pack
						_self.editForm.qty 						= _self.skuData[0].qty
						_self.editForm.yjtotqty 			= _self.skuData[0].yjtotqty
						_self.editForm.subsname 			= _self.skuData[0].subsname
						_self.editForm.username 			= _self.skuData[0].username
						_self.editForm.barcode 				= _self.skuData[0].barcode
						_self.editForm.bill 					= _self.skuData[0].bill
						_self.editForm.itemid 				= _self.skuData[0].itemid
						_self.editForm.subid 					= _self.skuData[0].subid
						_self.editForm.jhrq 					= _self.skuData[0].jhrq
					}else{
						_self.$toast.fail('暂无领取任务')
					}
				}
			});
		},
		editSkuClick(){
			this.addmode = !this.addmode
			this.isdisabled = true
			this.pack1 = this.editForm.pack
			this.qty1 = this.editForm.qty
		},
		saveSkuBtnClick(){
			console.log(this.editForm)
			console.log(this.qty1)
			console.log(this.pack1)
			if(this.qty1 != this.editForm.qty || this.pack1 != this.editForm.pack){
				this.$dialog.confirm({
				  title: '提示',
				  message:'是否将商品'+ this.editForm.itemid + '仓位' + this.editForm.cwno+'的拣货数量设置为'+'\n'
					+'箱装:'+ this.editForm.unit+'，' +'散数：' + this.editForm.qty,
				}).then(() => {
				   this.isdisabled = false
				   this.addmode = !this.addmode
				}).catch(() => {
				    // this.isdisabled = false
				    // this.addmode = !this.addmode
				});
			}else{
				this.isdisabled = false
				this.addmode = !this.addmode
			}
		},
		_getAddressBtn(){
			var _self = this;
			var ldemodata = [{retval:0, errmsg:'返回数据集'},]
			this.MYPOST({
				'method':'dgate',
				'pname':'f_wmsa_y_jianhuo',
				'i':this.FNULLE([
				'opmode','Y_LONGCHE_qrywz',
				'czyid',this.ryuser.operatorid,
				'kqid', this.ryuser.kqid,
				])
				},'笼车查询位置',true,ldemodata, function(ret_obj, ret_iserr,ret_errmess,ret_oldresp){
				if(ret_iserr){ //传入的true参数,理论上不会有此回调了
					_self.$toast.fail('查询失败')
					_self.$store.commit('hideLoading');
				}else{
					var rtn_json_obj = null;
					_self.$store.commit('hideLoading');
					if(ret_obj != null){ rtn_json_obj = ret_obj; //返回的接口可以直接解析的情况
					}else{  rtn_json_obj = _self.arr2Obj(ret_oldresp.data); //非标准的dgate接口,返回的一个不兼容的处理
					}
					console.log("得到笼车查询位置")
					console.log(rtn_json_obj)
					if(rtn_json_obj.length > 0){
						_self.addressItem = rtn_json_obj;
						_self.isAddressVisible = true
					}else{
						_self.$toast.fail('暂无位置信息')
					}
				}
			});
		},
		selectAddressClick(row){
				this.editForm.hqpbdq  = row.hqpbdq
				this.editForm.td_no  = row.td_no
				this.editForm.ck_storeid  = row.ck_storeid
				this.isAddressVisible = false
		},
		selectSkuClick(row){
			this.editForm.ck_storeid 		= row.ck_storeid
			this.editForm.storename 			= row.storename
			this.editForm.cwno 					= row.cwno
			this.editForm.unit 					= row.unit
			this.editForm.pack 					= row.pack
			this.editForm.qty 						= row.qty
			this.editForm.yjtotqty 			= row.yjtotqty
			this.editForm.subsname 			= row.subsname
			this.editForm.username 			= row.username
			this.editForm.barcode 				= row.barcode
			this.editForm.bill 					= row.bill
			this.editForm.itemid 				= row.itemid
			this.editForm.subid 					= row.subid
			this.editForm.jhrq 					= row.jhrq
			this.isSkuVisible = false
		},
		saveGoodsBtn(){
			if(this.verifyForm.itemid >'' && (this.editForm.itemid == this.verifyForm.itemid)){

			}else{
				return this.$toast('请核实当前商品是否与单据上一致')
			}


			if(this.verifyForm.cwno >'' && (this.editForm.cwno == this.verifyForm.cwno)){

			}else{
				return this.$toast('请核实当前仓位编码是否与单据一致')
			}


			let sendData = {
				'kqid':this.ryuser.kqid,
				'czyid':this.ryuser.operatorid,
				'is_bill':this.editForm.bill,
				'cwno':this.editForm.cwno,
				'yjtotqty':this.editForm.yjtotqty,
				'pack':this.editForm.pack,
				'qty':this.editForm.qty,
				'unit':this.editForm.unit,
				'itemid':this.editForm.itemid,
				'subid':this.editForm.subid,
				'ck_storeid':this.editForm.ck_storeid,
			}
			console.log(sendData)

				var _self = this;
				var ldemodata = [{retval:0, errmsg:'返回数据集'},]
				this.MYPOST({
						'method':'dgate',
						'pname':'f_wmsa_y_jianhuo',
						'i':this.FNULLE([
						'opmode','Y_LONGCHE_qritem',
						'kqid', this.ryuser.kqid,
						'czyid',this.ryuser.operatorid,
						'bill',this.editForm.bill,
						'cwno',this.editForm.cwno,
						'yjtotqty',this.editForm.yjtotqty,
						'pack',this.editForm.pack,
						'qty',this.editForm.qty,
						'unit',this.editForm.unit,
						'itemid',this.editForm.itemid,
						'subid',this.editForm.subid,
						'ck_storeid',this.editForm.ck_storeid,
					])
					}, '按店拣货保存',true, ldemodata, function(ret_obj, ret_iserr,ret_errmess,ret_oldresp){
					if(ret_iserr){ //传入的true参数,理论上不会有此回调了
						_self.$toast.fail('查询失败')
						_self.$store.commit('hideLoading');
					}else{
						var rtn_json_obj = null;
						_self.$store.commit('hideLoading');
						if(ret_obj != null){ rtn_json_obj = ret_obj; //返回的接口可以直接解析的情况
						}else{  rtn_json_obj = _self.arr2Obj(ret_oldresp.data); //非标准的dgate接口,返回的一个不兼容的处理
						}
						// _self.skuData = rtn_json_obj
						console.log("笼车拣货保存")
						console.log(rtn_json_obj[0])
						if(rtn_json_obj[0].ret_ret == '-1'){
							_self.$toast(rtn_json_obj[0].ret_mess)
						}else{
							_self.$toast(rtn_json_obj[0].ret_mess)
							_self.editForm.ck_storeid 		= ''
							_self.editForm.storename 			= ''
							_self.editForm.cwno 					= ''
							_self.editForm.unit 					= ''
							_self.editForm.pack 					= ''
							_self.editForm.qty 						= ''
							_self.editForm.yjtotqty 			= ''
							_self.editForm.subsname 			= ''
							_self.editForm.username 			= ''
							_self.editForm.barcode 				= ''
							_self.editForm.bill 					= ''
							_self.editForm.itemid 				= ''
							_self.editForm.subid 					= ''
							_self.editForm.jhrq 					= ''
							_self.skuData = [
								{
									subsname	:'',
									ck_storeid	:'',
									storename	:'',
								}
							]
							_self.verifyForm = {
								itemid:'',
								cwno:'',
								barcode:'',
							}
						}
					}
				});
		},
		overRongQiBtnClick(){
			console.log(this.editForm.bill)
			var _self = this;
			var ldemodata = [{retval:0, errmsg:'返回数据集'},]
			this.MYPOST({
					'method':'dgate',
					'pname':'f_wmsa_y_jianhuo',
					'i':this.FNULLE([
					'opmode','Y_LONGCHE_jsrq_qry',
					'kqid', this.ryuser.kqid,
					'czyid',this.ryuser.operatorid,
					'bill', this.editForm.bill,
				])
				}, '结束容器',true, ldemodata, function(ret_obj, ret_iserr,ret_errmess,ret_oldresp){
				if(ret_iserr){ //传入的true参数,理论上不会有此回调了
					_self.$toast.fail('查询失败')
					_self.$store.commit('hideLoading');
				}else{
					var rtn_json_obj = null;
					_self.$store.commit('hideLoading');
					if(ret_obj != null){ rtn_json_obj = ret_obj; //返回的接口可以直接解析的情况
					}else{  rtn_json_obj = _self.arr2Obj(ret_oldresp.data); //非标准的dgate接口,返回的一个不兼容的处理
					}
					console.log("得到结束容器")
					console.log(rtn_json_obj)
					_self.jieshuData = rtn_json_obj
					if(_self.jieshuData.length > 0){
						 _self.$router.push({ path: '/longchejieshu', query: {editForm:JSON.stringify(_self.editForm)}})
					}else{
						_self.$dialog.alert({title: '提示',message:'库区'+ _self.ryuser.kqid + '临时容器为空,不能执行结束容器操作! ',confirmButtonColor:'#1989fa'})
					}
				}
			});
		},
  },
  mounted() {

  },
	components: {

	},
};
</script>

<style lang="scss" scoped>
	// 引入公共样式
	@import '@/assets/css/base.scss';
	@import '@/assets/css/input.scss';
	div.zhengtuojianhuo{
		padding-top: 50px;
	}
</style>
